<!-- 财务概况 -->
<template>
    <div class="data-profile">
        <div class="ls-card">
            <div class="card-title">经营概况</div>
            <div class="card-content m-t-24">
                <el-row :gutter="20">
                    <el-col :span="6" class="flex-col col-center">
                        <div class="lighter m-b-8">累计营业额（元）</div>
                        <div class="font-size-30">{{ ProfileData.order_sum }}</div>
                    </el-col>
                    <el-col :span="6" class="flex-col col-center">
                        <div class="lighter m-b-8">累计成交订单数（笔）</div>
                        <div class="font-size-30">{{ ProfileData.order_num }}</div>
                    </el-col>
                    <el-col :span="6" class="flex-col col-center">
                        <div class="lighter m-b-8">累计售后退款金额（元）</div>
                        <div class="font-size-30">{{ ProfileData.after_sale_sum }}</div>
                    </el-col>
                </el-row>
            </div>
        </div>
        <div class="ls-card m-t-16">
            <div class="card-title">用户概况</div>
            <div class="card-content m-t-24">
                <el-row :gutter="20">
                    <el-col :span="6" class="flex-col col-center">
                        <div class="lighter m-b-8">用户总资产（元）</div>
                        <div class="font-size-30">{{ ProfileData.user_total_assets }}</div>
                    </el-col>
                    <el-col :span="6" class="flex-col col-center">
                        <div class="lighter m-b-8">用户可用余额（元）</div>
                        <div class="font-size-30">{{ ProfileData.user_money_sum }}</div>
                    </el-col>
                    <el-col :span="6" class="flex-col col-center">
                        <div class="lighter m-b-8">用户可提现金额（元）</div>
                        <div class="font-size-30">{{ ProfileData.user_earnings_sum }}</div>
                    </el-col>
                </el-row>
            </div>
        </div>
    </div>
</template>

<script lang="ts">
import { Component, Vue } from 'vue-property-decorator'
import { apiFinanceDataCenter } from '@/api/finance/finance'

@Component
export default class FinanceProfile extends Vue {
    /** S Data **/
    ProfileData = {}
    /** E Data **/

    /** S Methods **/
    // 获取财务概况
    financeDataCenter() {
        apiFinanceDataCenter()
            .then(res => {
                this.ProfileData = res
            })
            .catch(res => {
                console.log(res)
            })
    }
    /** E Methods **/

    /** S Life Cycle **/
    created() {
        this.financeDataCenter()
    }
    /** E Life Cycle **/
}
</script>

<style lang="scss" scoped>
.ls-card {
    .card-title {
        font-size: 14px;
        font-weight: 500;
    }
}
</style>
